import { defineStore } from 'pinia'
import { ref, computed } from 'vue'
import { store } from '@/store'

// 导出小仓库（适合于组件内 setup中使用）
// setup执行的时机相当于vue2的created生命周期
export const useSettingStore = defineStore(
  'setting',
  () => {
    const price = ref(100)
    const lang = ref('zh')
    const doublePrice = computed(() => {
      return price.value * 2
    })
    const increment = () => {
      price.value += 1
    }

    const changeLang = (langValue) => {
      console.log('切换：' + langValue)
      lang.value = langValue
    }

    // 将state、computed、action作为一个对象导出
    return { price, lang, doublePrice, increment, changeLang }
  },
  {
    // 将此仓库中的所有的数据持久化到本地存储
    persist: true,
  }
)

// 为了在组件外部使用（为了备用）
/**
 * 导出此hook函数用于在非组件环境(如其他store、工具函数等)中获取权限store实例
 *
 * 在组件中可直接使用useSettingStore()，但在组件外部需要传入store实例
 * 此函数简化了这个过程，避免每次都手动传入store参数
 */
export function useSettingStoreHook() {
  return useSettingStore(store)
}
